import 'dart:ui';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_douban/main_page/home/notes/note_detail_page.dart';
import 'package:flutter_douban/main_page/home/video/window_video_page.dart';
import 'package:flutter_douban/model/note_model.dart';
import '../../../main.dart';

class NoteItemCell extends StatelessWidget {
  final NoteModel model;
  const NoteItemCell({Key? key, required this.model}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return InkWell(
      child: Container(
        height: MediaQuery.of(context).size.width * 0.6,
        padding: EdgeInsets.only(left: 15, right: 15, top: 8, bottom: 8),
        child: Stack(
          children: [
            ClipRRect(
              child: CachedNetworkImage(
                imageUrl: model.image_u!,
                fit: BoxFit.cover,
                width: MediaQuery.of(context).size.width - 30,
                height: (MediaQuery.of(context).size.width - 30) * 0.7,
              ),
              borderRadius: BorderRadius.circular(6),
            ),
            Positioned(
                bottom: 0,
                child: Container(
                  height: 60,
                  color: Colors.black12,
                  width: MediaQuery.of(context).size.width - 30,
                  child: Center(
                    child: ClipRect(
                      // 可裁切矩形
                      child: BackdropFilter(
                        // 背景过滤器
                        filter: ImageFilter.blur(sigmaX: 5.0, sigmaY: 5.0),
                        child: Opacity(
                          opacity: 0.1,
                          child: Container(
                            alignment: Alignment.center,
                            height: double.infinity,
                            width: double.infinity,
                          ),
                        ),
                      ),
                    ),
                  ),
                )),
            Positioned(
                bottom: 0,
                child: Container(
                  padding: EdgeInsets.all(6),
                  child: Row(
                    children: [
                      ClipRRect(
                        child: CachedNetworkImage(
                          imageUrl: model.p!,
                          fit: BoxFit.cover,
                          width: 36,
                          height: 36,
                        ),
                        borderRadius: BorderRadius.circular(18),
                      ),
                      SizedBox(
                        width: 10,
                      ),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            width: MediaQuery.of(context).size.width - 90,
                            child: Text(
                              model.title!,
                              overflow: TextOverflow.ellipsis,
                              style: TextStyle(
                                fontSize: 16,
                                color: Colors.white,
                              ),
                            ),
                          ),
                          SizedBox(
                            height: 2,
                          ),
                          Text(
                            model.n!,
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              fontSize: 12,
                              color: Colors.white,
                            ),
                          )
                        ],
                      ),
                    ],
                  ),
                ))
          ],
        ),
      ),
      onTap: () {
        Navigator.of(context).push(MaterialPageRoute(builder: (_) {
          if (model.video_url?.isNotEmpty == true) {
            return WindowVideoPage(
              playType: PlayType.network,
              dataSource: model.video_url!,
              id: int.parse(model.id!),
            );
          } else {
            return NoteDetailPage(
              id: int.parse(model.id!),
            );
          }
        }));
      },
    );
  }
}
